{% extends "base.html" %}

{% block title %}
    职位管理
{% endblock %}



{% block content %}
    <div id="page-wrapper">
        <div class="container-fluid">
            <div class="row">
                <div class="col-lg-12">
                    <h1 class="page-header">
                        {{department.d_name}}-其下职位
                        <a class="btn btn-default pull-right" data-toggle="modal" data-target="#add_modal">添加</a>

                    </h1>
                </div>
                <!-- /.col-lg-12 -->
            </div>
            <!-- /.row -->
            <div class="row">
                <div class="col-lg-12">
                    <div class="row">
                        <table class="table">
                            <thead>
                            <tr>
                                <th>职位名称</th>
                                <th>职位等级</th>
                                <th>职位操作</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for position in position_list %}
                            <tr>
                                <td class="col-lg-4">{{position.p_name}}</td>
                                <td class="col-lg-4">{{position.p_level}}</td>
                                <td class="col-lg-4">
                                    {#  为了实现模态框渲染数据和修改，加一个点击动作，编写js代码#}
                                    <a class="btn btn-default" data-toggle="modal" data-target="#edit_modal"
                                       onclick="edit('{{ position.id }}','{{ position.p_name }}','{{ position.p_level }}')">编辑</a>
                                    <a class="btn btn-default" href="#" onclick="delpos({{ position.id }})">删除</a>
                                </td>
                            </tr>

                            {% endfor %}

                            </tbody>
                        </table>
                    </div>
                    <div class="modal" id="add_modal">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal"><span>&times;</span>
                                    </button>
                                    <h4>新增职位</h4>
                                </div>
                                <div class="modal-body">
                                    <form action="" method="post">
                                        {#下发scrf_token#}
                                        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                                        <div class="form-group">
                                            <label class="control-label">职位名称：</label>
                                            <input class="form-control" type="text" name="name">
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label">职位等级：</label>
                                            <input class="form-control" type="number" name="level">
                                        </div>
                                        <div class="form-group">
                                            <button class="btn btn-primary btn-block">提交</button>
                                        </div>
                                    </form>
                                </div>
                                <!--
                                <div class="modal-footer"></div>
                                -->
                            </div>
                        </div>
                    </div>
                    <div class="modal" id="edit_modal">
                        <div class="modal-dialog">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <button type="button" class="close" data-dismiss="modal"><span>&times;</span>
                                    </button>
                                    <h4>编辑职位</h4>
                                </div>
                                <div class="modal-body">
                                    <form action="/edit_position" method="post">
                                        {#下发scrf_token#}
                                        <input type="hidden" name="csrf_token" value="{{ csrf_token() }}">
                                        <input type="hidden" name="pos_id" value="" id="position_id">
                                        <div class="form-group">
                                            <label class="control-label">职位名称：</label>
{#                                            <input class="form-control" type="text" name="name" value="">#}
                                            <input class="form-control" type="text" name="name" id="position_name">
                                        </div>
                                        <div class="form-group">
                                            <label class="control-label">职位等级：</label>
{#                                            <input class="form-control" type="number" name="level" value="">#}
                                            <input class="form-control" type="number" name="level" id="position_level">
                                        </div>
                                        <div class="form-group">
                                            <button class="btn btn-primary btn-block">提交</button>
                                        </div>
                                    </form>
                                </div>
                                <!--
                                <div class="modal-footer"></div>
                                -->
                            </div>
                        </div>
                    </div>
                </div>
                <!-- /.col-lg-12 -->
            </div>
        </div>
        <!-- /.container-fluid -->
    </div>
{% endblock %}


{% block script %}

    <script>
        function delpos(id) {
        // 获取到职位id
        // 发送 get 请求  传递id\
        url = "/delete_position?pos_id=" + id;
        $.ajax({
            url:url,
            data:"",
            type:"get",
            success:function (data) {
                console.log(data);
                window.location.reload();
            },
            error:function (error) {
                console.log(error)
            }
        })
        };


        {#编写指向edit的动作#}
        function edit(id,name,level) {        
            $("#position_id").val(id); 
            $("#position_level").val(level);        
            $("#position_name").val(name);
            }
    </script>
{% endblock %}

